<style scoped lang="less">
.iot-blk{
	height: auto;
}
</style>
<template>
	<div class="iot-blk">
		<div class="con">
			<el-form :inline="true" class="filter-blk flex-1">
				<el-form-item class="ml-20" label="设备编号">
					<el-input placeholder="请输入" v-model.trim="filterForm.number"></el-input>
				</el-form-item>
				<el-form-item class="ml-20" label="安装地址">
					<el-input placeholder="请输入" v-model.trim="filterForm.position"></el-input>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="searchAction"><i class="iconfont icon-search"></i> 查询</el-button>
				</el-form-item>
			</el-form>
			<Device ref="alarmDeviceList" alarmType="alarm"></Device>
			<Device ref="normalDeviceList" alarmType="normal"></Device>
			<Device ref="offlineDeviceList" alarmType="offline"></Device>
		</div>
		<i class="corner bottom"></i>
		<i class="corner top"></i>
	</div>
</template>
<script>
import Device from '@/components/census/unitIOT/UnitDeviceType.vue'
export default {
	name: 'iotBlk',
	props: {
		data: {
    		type: Array,
			default () {
				return []
			}
    	},
	},
	components: {
		Device
	},
	watch: {},
	data () {
		return {
			loading: false,
			filterForm: {}
		}
	},
	methods: {
		initData () {
			this.$refs.alarmDeviceList.getData(1,this.filterForm)
			this.$refs.normalDeviceList.getData(1,this.filterForm)
			this.$refs.offlineDeviceList.getData(1,this.filterForm)
		},
		searchAction () {
			this.initData()
		}
	},
	mounted () {
		this.initData()
	},
}
</script>